// JavaScript Document
function removeCurrentPanel(mainCt, current) {
	try {
		mainCt.remove(current);
	} catch(err) {
		console.log("catch" + err);
	}
}
/**
 * 
 * @Model
 * 	University
 */
Ext.define('University', {
    extend: 'Ext.data.Model',
    fields:['id', 'name']
});
Ext.define('Writer.University', {
    extend: 'Ext.data.Model',
    fields: [{
        name: 'name',
        type: 'string'
    }],
    validations: [{
        type: 'length',
        field: 'name',
        min: 1
    }]
});

/**
 * @University.Grid Script
 */
Ext.define('University.Grid', {
	extend: 'Ext.grid.Panel',
	alias: 'widget.universitygrid',
	
	requires: [
		'Ext.grid.plugin.RowEditing',
		'Ext.form.field.Text',
		'Ext.toolbar.TextItem'
	],
	
    initComponent: function() {
	
		var editing = Ext.create('Ext.grid.plugin.RowEditing', {
			clicksToMoveEditor: 1,
        	autoCancel: false
		});
		this.editing = editing;
	
		Ext.apply(this, {
			id : 'university-grid',
			title : '校区管理',
			iconCls: 'panel-title',
			plugins: [editing],
			dockedItems: [{
				xtype: "toolbar",
				items: [{
					iconCls: 'icon-add',
                    text: '添加',
                    scope: this,
                    handler: this.onAddClick
				}, {
					xtype : 'tbseparator'
				}, {
					text : '删除',
					iconCls: 'icon-delete',
					disabled: true,
					itemId: "unv-remove",
					handler: this.onDeleteClick
				}, {
					xtype : 'tbseparator'
				}, {
					iconCls: 'icon-save',
                    text: '保存',
                    scope: this,
                    handler: this.onSync
				}]
			}],
			
			selModel: Ext.create('Ext.selection.CheckboxModel', {}),
		    
		    columns: [
		        Ext.create('Ext.grid.RowNumberer'),
		        { header: '大学名称', dataIndex: 'name', width: 150, field: 'textfield'},
		        { header: "",  width: 120}
		    ]
		});
		this.callParent();
		this.getSelectionModel().on('selectionchange', this.onSelectChange, this);
    },
    onSelectChange: function(selModel, selections) {
    	this.down('#unv-remove').setDisabled(selections.length === 0)
    },
    onDeleteClick: function(){
    	var grid = this.up("universitygrid");
    	Ext.MessageBox.confirm("Confirm", "确定删除所选的项吗?", function(btn) {
    		if("yes" == btn) {
    			var selection = grid.getView().getSelectionModel().getSelection();
		        if (selection) {
		            grid.store.remove(selection);
		        }
    		}
    	});
    },
	onAddClick: function(){
        var rec = new Writer.University({
            name: ''
        });
        edit = this.editing;

        edit.cancelEdit();
        this.store.insert(0, rec);
        edit.startEdit(0,0);
    },
    onSync: function() {
    	this.store.sync();
    	this.store.load();
    }
});

/**
 * @Ext.onReady
 */
Ext.onReady(function() {
	
	Ext.tip.QuickTipManager.init();
	
	/**
	 * @StoreDeclare
	 */
	var uniDataStore = Ext.create('Ext.data.Store', {
	    model: "University",
	    autoLoad: false,
	    autoSync: false,
	    proxy: {
	        type: 'ajax',
	        api: {
				read: 'university/list',
				update: 'university/update',
				create: 'university/add',
				destroy: 'university/delete'
			},
			reader: {
				type: 'json',
                successProperty: 'success',
                root: 'data',
                messageProperty: 'message'
			},
			writer: {
                type: 'json',
                writeAllFields: false,
                root: 'university'
            }
	    },
	    listeners: {
            write: function(proxy, operation){
                Ext.example.msg(operation.action, operation.resultSet.message);
            }
        }
	});
	
	var mainCt = Ext.create('Ext.container.Container', {
    	region: 'center',
    	border: false,
    	layout: 'fit',
    	items: [Ext.create('Ext.panel.Panel', {
    		id: 'welcome-panel',
    		title: ' ',
    		html: '<h1>Welcome</h1>'
    	})]
    });
	
	
	Ext.create('Ext.container.Viewport', {
	    layout: 'border',
	    renderTo: Ext.getBody(),
	    items: [{
	        region: 'north',
	        height: 70,
	        border: false,
	        html: '<img src="img/small-logo.gif" style="margin-top: 15px; margin-left: 15px;"/>'
	    }, {
	    	region: 'west',
	    	width: 180,
	    	xtype: 'panel',
	    	layout: 'accordion',
	    	layoutConfig: {  
	            titleCollapse: true,  
	            collapseFirst : false,  
	            animate: true,  
	            hideCollapseTool : false,  
	            activeOnTop: false  
	        },
	    	defaults: {
	    		collapsed:true
	    	},
	    	iconCls: 'left-panel-title-icon',
	    	margins: '0 5 0 1',
	    	title: '管理项',
	    	items: [{
	    		title: '用户信息管理',
	    		iconCls: 'nav-base',
	    		collapsed:true,
	    		html: '<ul id="nav1" class="nav">' +
						'<li id="nav1-1"><img src="img/manager.png"/>管理员帐号管理</li>' +
						'<li id="nav1-2"><img src="img/user.png"/>普通用户管理</li>' +
						'<li id="nav1-3"><img src="img/world.png"/>校区管理</li>' +
					'</ul>'
	    	}, {
	    		title: '商品信息管理',
	    		iconCls: 'nav-commodity',
	    		collapsed:true,
	    		html: '<ul id="nav2" class="nav">' +
						'<li id="nav2-1"><img src="img/check.png"/>已发布的商品管理</li>' +
						'<li id="nav2-2"><img src="img/sitemap2.png"/>商品类别管理</li>' +
					'</ul>'
	    	}, {
	    		title: '页面定制管理',
	    		iconCls: 'nav-index',
	    		collapsed:true,
	    		html: '<ul id="nav3" class="nav">' +
						'<li id="nav3-1"><img src="img/sitemap2.png"/>首页 Logo 设定</li>' +
						'<li id="nav3-2"><img src="img/sitemap2.png"/>首页 快速链接 设定</li>' +
						'<li id="nav3-3"><img src="img/sitemap2.png"/>首页 图片链接 设定</li>' +
						'<li id="nav3-4"><img src="img/sitemap2.png"/>首页 热门搜索 设定</li>' +
						'<li id="nav3-5"><img src="img/sitemap2.png"/>热门排行 设定</li>' +
						'<li id="nav3-6"><img src="img/sitemap2.png"/>同类商品价格对比 设定</li>' +
					'</ul>'
	    	}]
	    }, mainCt
	    ]
	});
	
	
	var currentMainPanel = Ext.getCmp('welcome-panel');
	
	$(".nav li").bind("click", function() {
		$(".nav li").removeClass("selected");
		$(this).addClass("selected");
	});
	
	Ext.get('nav3-4').on('click', function() {
		if(currentMainPanel.getId() == "hotlink-panel") {
			return;
		}
		removeCurrentPanel(mainCt, currentMainPanel);
		currentMainPanel.close();
		var panel = createHotLinkPanel();
		mainCt.add(panel);
		currentMainPanel = panel;
	});
	
	Ext.get('nav3-3').on('click', function() {
		if(currentMainPanel.getId() == "imagelink-panel") {
			return;
		}
		removeCurrentPanel(mainCt, currentMainPanel);
		currentMainPanel.close();
		var panel = createImageLinkPanel();
		mainCt.add(panel);
		currentMainPanel = panel;
	});
	
	Ext.get('nav3-2').on('click', function() {
		if(currentMainPanel.getId() == "quicklink-panel") {
			return;
		}
		removeCurrentPanel(mainCt, currentMainPanel);
		currentMainPanel.close();
		var panel = createQuickLinkPanel();
		mainCt.add(panel);
		currentMainPanel = panel;
	});
	
	Ext.get('nav3-1').on('click', function() {
		if(currentMainPanel.getId() == "logo-panel") {
			return;
		}
		removeCurrentPanel(mainCt, currentMainPanel);
		currentMainPanel.close();
		var panel = createLogoManagePanel();
		mainCt.add(panel);
		currentMainPanel = panel;
	});
	
	Ext.get('nav2-2').on('click', function() {
		if(currentMainPanel.getId() == "catagory-panel") {
			return;
		}
		removeCurrentPanel(mainCt, currentMainPanel);
		currentMainPanel.close();
		var panel = createCatagoryPanel();
		mainCt.add(panel);
		currentMainPanel = panel;
	});
	
	Ext.get('nav2-1').on('click', function() {
		if(currentMainPanel.getId() == "commodity-panel") {
			return;
		}
		removeCurrentPanel(mainCt, currentMainPanel);
		currentMainPanel.close();
		var panel = createCommodityPanel();
		mainCt.add(panel);
		currentMainPanel = panel;
	});
	
	Ext.get('nav1-1').on('click', function() {
		if(currentMainPanel.getId() == "manager-panel") {
			return;
		}
		removeCurrentPanel(mainCt, currentMainPanel);
		currentMainPanel.close();
		var panel = createManagerPanel();
		mainCt.add(panel);
		currentMainPanel = panel;
	});
	
	Ext.get('nav1-2').on('click', function() {
		if(currentMainPanel.getId() == "user-panel") {
			return;
		}
		removeCurrentPanel(mainCt, currentMainPanel);
		currentMainPanel.close();
		var panel = createUserPanel();
		mainCt.add(panel);
		currentMainPanel = panel;
	});
	
	
	
	Ext.get('nav1-3').on('click', function() {
		if(currentMainPanel.getId() == "uni-grid") {
			return;
		}
		removeCurrentPanel(mainCt, currentMainPanel);
		currentMainPanel.close();
		uniDataStore.load();
		var panel = Ext.create("University.Grid", {
			store: uniDataStore
		});
		mainCt.add(panel);
		currentMainPanel = panel;
	});
	
	
});